<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <link rel="shortcut icon" href="favicon.ico" />
    <link rel="apple-touch-icon" href="favicon.ico" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>hhy的个人主页</title>

    <meta property="og:type" content="acticle">
    <meta property="og:locale" content="zh-CN" />
    <meta property="og:image" content="./static/favicon.ico">
    <link rel="shortcut icon" href="./static/favicon.ico">
    <link rel="stylesheet" type="text/css" href="static/css/bootstrap.min.css">
    <link rel='stylesheet' type='text/css' href='static/css/linea.css'>
    <link rel='stylesheet' type='text/css' href='static/css/ionicons.min.css'>
    <link rel='stylesheet' type='text/css' href='static/css/owl.carousel.css'>
    <link rel='stylesheet' type='text/css' href='static/css/magnific-popup.css'>
    <link rel='stylesheet' type='text/css' href='static/css/style.css'>
    <link rel="stylesheet" type='text/css' href="static/css/font-awesome.min.css">
</head>

<body>

    <div id='preloader'>
        <div class='loader'></div>
        <div class='left'></div>
        <div class='right'></div>
    </div>
    <div class='main-content'>

        <div class='page-border border-left'></div>
        <div class='page-border border-right'></div>
        <div class='page-border border-top'></div>
        <div class='page-border border-bottom'></div>

        <a href='#' class='menu-btn'>
            <span class='lines'>
                <span class='l1'></span>
                <span class='l2'></span>
                <span class='l3'></span>
            </span>
        </a>

        <div class='menu'>
            <div class='inner'>
                <ul class='menu-items'>
                    <li>
                        <a href='#' class='section-toggle' data-section='intro'>
                            主页
                        </a>
                    </li>
                    <li>
                        <a href='#about' class='section-toggle' data-section='about'>
                            关于我
                        </a>
                    </li>
                    <li>
                        <a href='#resume' class='section-toggle' data-section='resume'>
                            时间轴
                        </a>
                    </li>
                </ul>
            </div>
        </div>
        <div class='animation-block'></div>

        <div class='sections'>

            <section id='intro' class='section section-main active'>
                <div class='container-fluid'>
                    <div class='v-align'>
                        <div class='inner'>
                            <div class='intro-text'>
                                <h1>HEHONGYU</h1>
                                <p>
                                    一个web萌新
                                </p>
                                <p>
                                    <a href="#" rel="nofollow">暂无备案号(正在努力申请中~~)</a>
                                </p>
                                <div class='intro-btns'>
                                    <a href='#about' class='btn-custom section-toggle' data-section='about'>
                                        关于我
                                    </a>
                                    <a href='#resume' class='btn-custom section-toggle' data-section='resume'>
                                        时间轴
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>

            <section id='about' class='section about-section border-d'>
                <div class='section-block about-block'>
                    <div class='container-fluid'>
                        <div class='section-header' style="display: flex; margin-bottom: 0;">
                            <h2>
                                一个 <strong class='color'>Web萌新</strong>
                            </h2>
                            <div class='col-md-8'>
                                <div class='about-text'>
                                    <p>
                                        从小热爱互联网，喜欢不断探索，经过不断学习，让爱好变成事业。
                                    </p>
                                    <p>
                                        Love the Internet since childhood, like to explore, after continuous
                                        learning, let the hobby into a career.
                                    </p>
                                </div>
                            </div>
                        </div>
                        <div class='row' style="width: 600px;">
                            <div>
                                <ul class='info-list' style="display:flex;justify-content:space-between;">
                                    <li style="width:200px;">
                                        <strong>姓名:</strong>
                                        <span>HeHongYu</span>
                                    </li>
                                    <li style="width: 200px;">
                                        <strong>邮箱:</strong>
                                        <span><a href="2067684844@qq.com">2067684844@qq.com</a></span>
                                    </li>
                                </ul>
                                <ul class='info-list' style="display:flex;justify-content:space-between;">
                                    <li style="width: 200px;">
                                        <strong>工作:</strong>
                                        <span>前端开发实习生</span>
                                    </li>
                                    <li style="width: 200px;">
                                        <strong>年龄:</strong>
                                        <span>22 岁</span>
                                    </li>
                                </ul>
                                <ul class='info-list' style="display:flex;justify-content:space-between;">
                                    <li style="width:200px">
                                        <strong>现居:</strong>
                                        <span>四川成都</span>
                                    </li>
                                    <li style="width:200px;">
                                        <strong>家乡:</strong>
                                        <span>四川内江</span>
                                    </li>
                                </ul>
                            </div>

                        </div>
                    </div>
                </div>
                <div class='section-block skills-block'>
                    <div class='container-fluid'>
                        <div class='section-header'>
                            <h2>
                                我的 <strong class='color'>技能</strong>
                            </h2>
                        </div>
                        <div class='row'>
                            <div class='col-md-6'>
                                <div class='skill'>
                                    <h4>HTML/CSS</h4>
                                    <div class='bar'>
                                        <div class='percent' style='width:50%;'></div>
                                    </div>
                                </div>
                                <div class='skill'>
                                    <h4>JavaScript</h4>
                                    <div class='bar'>
                                        <div class='percent' style='width:30%;'></div>
                                    </div>
                                </div>
                                <div class='skill'>
                                    <h4>jQuery</h4>
                                    <div class='bar'>
                                        <div class='percent' style='width:20%;'></div>
                                    </div>
                                </div>
                            </div>
                            <div class='col-md-6'>

                                <div class='skill'>
                                    <h4>VUE</h4>
                                    <div class='bar'>
                                        <div class='percent' style='width:25%;'></div>
                                    </div>
                                </div>
                                <div class='skill'>
                                    <h4>UNIAPP</h4>
                                    <div class='bar'>
                                        <div class='percent' style='width:15%;'></div>
                                    </div>
                                </div>
                                <div class='skill'>
                                    <h4>ES6</h4>
                                    <div class='bar'>
                                        <div class='percent' style='width:38%;'></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </section>

            <section id='resume' class='section resume-section border-d'>
                <div class='section-block timeline-block'>
                    <div class='container-fluid'>
                        <div class='section-header'>
                            <h2>关于我 <strong class='color'>前端学习时间轴</strong></h2>
                        </div>
                        <ul class='timeline'>
                            <li>
                                <div class='timeline-content'>
                                    <h4>深入学习前端框架</h4>
                                    <em>
                                        <span>2022-01</span>
                                    </em>
                                    <p>

                                    </p>
                                </div>
                            </li>
                            <li>
                                <div class='timeline-content'>
                                    <h4>ES6</h4>
                                    <em>
                                        <span>2021-10</span>
                                    </em>
                                    <p>

                                    </p>
                                </div>
                            </li>
                            <li>
                                <div class='timeline-content'>
                                    <h4>学习第三方库</h4>
                                    <em>
                                        <span>2021-09</span>
                                    </em>
                                    <p>

                                    </p>
                                </div>
                            </li>
                            <li>
                                <div class='timeline-content'>
                                    <h4>开始学习JavaScript</h4>
                                    <em>
                                        <span>2021.06</span>
                                    </em>
                                    <p>

                                    </p>
                                </div>
                            </li>
                            <li>
                                <div class='timeline-content'>
                                    <h4>开始学习HTML/CSS</h4>
                                    <em>
                                        <span>2021.05</span>
                                    </em>
                                    <p>

                                    </p>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>

            </section>

        </div>
    </div>

    <script src="static/js/jquery-3.4.1.min.js"></script>
    <script src='static/js/jquery.shuffle.min.js'></script>
    <script src='static/js/owl.carousel.min.js'></script>
    <script src='static/js/jquery.magnific-popup.min.js'></script>
    <script src='static/js/validator.min.js'></script>
    <script src='static/js/script.js'></script>
    <script>
        var _hmt = _hmt || [];
        (function () {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?372a08e67b0676cfadeb60745a9af02f";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
        $('a').click(function () {
            if ($(this).attr('href') != 'https://beian.miit.gov.cn') {
                return false;
            }
        });
    </script>

</body>

</html>